<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>jQuery UI 日期选择器（Datepicker） - 动画</title>
    <link href="../bower_components/jquery-ui/themes/smoothness/jquery-ui.min.css" rel="stylesheet">
    <link href="../bower_components/jquery-ui/themes/smoothness/jquery-ui.css" rel="stylesheet">
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <script src="../bower_components/jquery-ui/jquery-ui.js"></script>
    <script>
        $(function() {
            $( "#datepicker" ).datepicker();
            $( "#anim" ).change(function() {
                $( "#datepicker" ).datepicker( "option", "showAnim", $( this ).val() );
            });
        });
    </script>
</head>
<body>

<p>日期：<input type="text" id="datepicker" size="30"></p>

<p>动画：<br>
    <select id="anim">
        <option value="show">Show (默认)</option>
        <option value="slideDown">滑下</option>
        <option value="fadeIn">淡入</option>
        <option value="blind">Blind (UI 百叶窗特效)</option>
        <option value="bounce">Bounce (UI 反弹特效)</option>
        <option value="clip">Clip (UI 剪辑特效)</option>
        <option value="drop">Drop (UI 降落特效)</option>
        <option value="fold">Fold (UI 折叠特效)</option>
        <option value="slide">Slide (UI 滑动特效)</option>
        <option value="">无</option>
    </select>
</p>


</body>
</html>			